<template>
<!--  资产概览   -->
  <div class="border-list-wk border-top-linear border-bottom-linear border-color flex">
    <div class="left-count">
      <p class="left-count-value"><span>{{ data.value }}</span>个</p>
      <p class="left-count-title">{{ data.title }}</p>
    </div>
    <div class="right-img">
      <img :src="require('@/assets/images/'+data.img)" alt="">
    </div>
  </div>
</template>

<script>
export default {
  name: "BorderList",
  props: {
    data: {
      type: Object,
      default() {
        return {
          value: 12,
          title: '交换机',
          img:'img_cycle1.png'
        }
      }
    }
  }
}
</script>

<style scoped lang="scss">
.border-list-wk {
  padding:.8rem;
  margin-bottom: 1.1rem;
}

.left-count {
  flex: 1;

  .left-count-value {
    span {
      font-size: 1.2rem;
      color: #FACC29;
      margin-right: .8rem;
    }
  }

  .left-count-title {
    margin-top: 10px;
  }
}

.right-img {
  img {
    width: 4rem;
  }
}
</style>
